<template>
  <div>
    <!-- 选择未指派菜单司机 2018/3/7 11:44 zhangQ -->
    <Form ref="dispatchForm" :model="dispatchForm" :rules="roleDispatchForm" :label-width="80">
      <FormItem label="选择司机" prop="driverIds">
        <Row>
          <i-col :span="8">
            <CheckboxGroup v-model="filterVal">
              <template v-for="item in truckTypeList">
                <Checkbox :label="item.id" :true-value="item.id">{{ item.name }}</Checkbox>
                <br>
              </template>
            </CheckboxGroup>
          </i-col>
          <i-col :span="16">
            <Transfer
              ref="transfer"
              :data="driverListTransfer"
              :target-keys="dispatchForm.driverIds"
              :render-format="renderFormat"
              :list-style="{width:'200px',height: '350px'}"
              filterable
              @on-change="checkDriverHandleChange"
              :filter-method="driverListFilter">
              <div :style="{float: 'right', margin: '5px'}">
                <Button type="ghost" size="small" @click="resetData">重置</Button>
              </div>
            </Transfer>
          </i-col>
        </Row>
      </FormItem>
      <div class="xlinkModal-footer">
        <Button type="primary" @click="onOk">确认</Button>
      </div>
    </Form>
  </div>
</template>

<script>
  import _ from 'lodash'
  import {getTruckTypeList} from '@api/backEnd/fleetControl'
  import {dispatchToDriverPickUp} from '@api/backEnd/fetchingBusiness/index'

  export default {
    name: 'check-driver-modal',
    data () {
      let dispatchForm = {driverIds: []}
      let roleDispatchForm = {}
      let filterVal = []
      let truckTypeList = []
      let driverListTransfer = []
      let isEdit = true
      let datas = {dispatchForm, roleDispatchForm, isEdit, driverListTransfer, truckTypeList, filterVal}
      return datas
    },
    props: {
      currentMainOrder: {
        type: Object,
        default () {
          return {}
        }
      },
      form: {
        type: Object,
        default () {
          return {}
        }
      },
      driverList: {
        type: Array,
        default () {
          return []
        }
      },
      addressList: {
        type: Array,
        default () {
          return []
        }
      }
    },
    watch: {
      filterVal (val) {
        let transfer = this.$refs.transfer
        transfer.$refs.left['showFooter'] = true
      }
    },
    computed: {},
    methods: {
      getTruckType () {
        getTruckTypeList().then(res => {
          this.truckTypeList = res.data.data
        })
      },
      renderFormat (item) {
        return item.label + ' - ' + item.description
      },
      resetData () {
        if (!this.form.driverIds) {
          this.form.driverIds = '[]'
        }
        this.dispatchForm.driverIds = JSON.parse(this.form.driverIds)
      },
      checkDriverHandleChange (newTargetKeys, direction, moveKeys) {
        this.dispatchForm.driverIds = newTargetKeys
      },
      driverListFilter (data, txt) {
        let upTxt = txt.toUpperCase()
        let lowTxt = txt.toLowerCase()
        let rightData = this.$refs.transfer.rightData
        if (rightData) {
          if (_.find(rightData, {'key': String(data.key)})) {
            return true
          }
        }
        if (this.filterVal && this.filterVal.length > 0) {
          let isType = _.some(this.filterVal, function (o) {
            return String(o) === String(data.row.type)
          })
          if (!isType) {
            return false
          }
        }
        return (_.includes(data.row['login_name'], upTxt) || _.includes(data.row['login_name'], lowTxt)) || (_.includes(data.row['truck_no'], upTxt) || _.includes(data.row['truck_no'], lowTxt)) || (_.includes(data.row['login_namePy'], upTxt) || _.includes(data.row['login_namePy'], lowTxt))
      },
      onOk () {
        this.$refs['dispatchForm'].validate((valid) => {
          if (valid) {
            let param = []
            this.dispatchForm.driverIds.forEach((item) => {
              let driveName = _.result(_.find(this.driverList, {'id': String(item)}), 'login_name')
              let driveList = {'pickUpId': this.currentMainOrder.id, 'driverId': item, 'driverName': driveName}
              param.push(driveList)
            })
            if (param.length <= 0) {
              this.$Notice.warning({
                title: '温馨提示',
                desc: '请选择司机！'
              })
              return
            }
            dispatchToDriverPickUp(param).then(res => {
              if (+res.data.isSuccess === 1) {
                this.$Notice.success({
                  title: '成功',
                  desc: '派单成功'
                })
                this.$emit('close')
              } else {
                this.$Notice.warning({
                  title: '失败',
                  desc: '派单失败'
                })
              }
            })
          } else {
          }
        })
      }
    },
    created () {
    },
    mounted () {
      let driverListTransfer = []
      this.driverList.forEach((item) => {
        driverListTransfer.push({
          key: item.id,
          label: item.login_name,
          description: item.truck_no,
          row: item
        })
      })
      this.driverListTransfer = driverListTransfer
      this.getTruckType()
    },
    components: {}
  }
</script>

<style scoped>

</style>
